<h2 class="grid_12">
Evento: <?php echo $pista['Evento']['nombre']; ?> <br />
Pista: <?php echo $pista['Pista']['nombre'] ?><br />
D&iacute;a: <?php echo $this->Utilidades->fechaes($pista['EventosPista']['fecha']); ?>
</h2>                                                                                
<div class="grid_8">
    <div class="box">
        <div class="header">
            <?php echo $this->Html->image('cross.png') ?>
            <h3>Listado de Mascotas en el evento</h3>
            <span></span>
        </div>
        <?php //comienza el contenido que quieres colocar ?>
        <div class="content">
            <table class="table" id="eventos">
                <thead>
                    <tr>
                        <th>Categor&iacute;a</th>
                        <th>#cat&aacute;logo</th>
                        <th>C&oacute;digo</th>                  
                        <th>Ejemplar</th>                        
                        <th>Raza</th> 
                        <th>Acciones</th>                        
                    </tr>
                </thead>
                <?php //debug($mascotas); ?>
                <tbody>
                    <?php foreach ($ejemplares as $ejemplar): ?>
                        <?php $id = $ejemplar['EventosMascota']['id']; ?>
                    <div id="cuadro_<?php echo $id; ?>">                       
                    </div>
                    <tr>                            
                        <td><?php echo $ejemplar['Categoriaspista']['nombre']; ?></td>
                        <td><?php echo $ejemplar['EventosMascota']['catalogo']; ?></td>
                        <td><?php echo $ejemplar['EventosMascota']['codigo']; ?></td>
                        <td><?php echo $ejemplar['Mascota']['nombre']; ?></td>
                        <td><?php echo $ejemplar['Mascota']['Raza']['nombre']; ?></td>                            
                        <td>
                            <div id="dialog_<?php echo $id; ?>" style="float: left;">
                                <?php
                                echo $this->Html->image("icons/packs/diagona/16x16/024.png", array("title" => "Registrar puntaje por raza"));
                                ?>
                            </div>  
                            <div id="dialog2_<?php echo $id;?>" style="float: left;">
                            <?php 
                            echo $this->Html->image("cross.png", array('title'=>"Puntaje por grupo"));
                             ?>
                            </div>                          
                             <script type="text/javascript">
                                var dialogOpts = {
                                   modal: true,
                                   title: "Puntaje por Raza",
                                   width: 410,
                                   minWidth: 410,
                                   maxWidth: 500,
                                   position: ['top', 20],
                                   show: "fold",
                                   hide: "scale"
                                };
                                $("#dialog_<?php echo $id; ?>").click(function(){
                                    //alert("click <?php echo $id; ?>");
                                    url = "http://localhost/kennel/Pistas/ajaxpuntaje/";
                                    $("#cuadro_<?php echo $id ?>").dialog(dialogOpts).load(url+"<?php echo $id; ?>/<?php echo $pista['EventosPista']['id']; ?>/<?php echo $pista['Pista']['id'] ?>");
                                }); 
                                $("#dialog2_<?php echo $id; ?>").click(function(){
                                    //alert("click <?php echo $id; ?>");
                                    url = "http://localhost/kennel/Pistas/ajaxpuntajegrupo/";
                                    $("#cuadro_<?php echo $id ?>").dialog(dialogOpts).load(url+"<?php echo $id; ?>/<?php echo $pista['EventosPista']['id']; ?>/<?php echo $pista['Pista']['id'] ?>");
                                });                                                   
                            </script>
                        </td>
                    </tr>
                    
                <?php endforeach; ?>
                </tbody>  
                
            </table>   
            <script>
                $(window).load(function() {
                    $('#eventos').dataTable();
                    $(window).resize();
                });
            </script>
        </div>
        <?php //fin del contenido a colocar   ?>
    </div> <!-- End of .box -->
</div> <!-- End of .grid_4 -->                                            
<div class="grid_4">
    <?php echo $this->element('menu_eventos') ?> 
</div> <!-- End of .grid_4 -->

<!-- End of #main_content -->
<div class="push clear"></div>
<?php echo $this->element('js_tablas'); ?>